# Tic Tac Toe

<EpicVideo url="https://www.epicreact.dev/workshops/react-hooks/intro-to-tic-tac-toe" />

This exercise is just to give you more practice with `useState` and `useEffect`.
For the most part, this is just review, but there is one thing we'll be doing
in this exercise we haven't done yet with `useState` and that is, it can
actually accept a function. For example:

```tsx
const [count, setCount] = useState(0)

// then in a click event handler or something:
setCount(count + 1)

// but this is the exact same thing:
setCount((previousCount) => previousCount + 1)
```

Because there are two ways to do the same thing, it's nice to know why/when
you'd use one over the other. Here's the "rule":

**If your new value for state is calculated based on the previous value of
state, use the function form. Otherwise, either works fine.**

For a deeper dive on this, read
[useState lazy initialization and function updates](https://kentcdodds.com/blog/use-state-lazy-initialization-and-function-updates).

This one's a bit tougher than some of the other exercises, so make sure you're
well hydrated and do a bit of stretching before starting this.
